
dojo.provide("simp.RegionSelector");
dojo.require("dijit._Widget");
dojo.require("dijit._Templated"); 
dojo.require("simp.DragResizeRegion");

dojo.declare('simp.RegionSelector',
	[dijit._Widget, dijit._Templated],
{
	// minHeight: Integer
	//	smallest height in px resized node can be
	minHeight: 50,

	// minWidth: Integer
	//	smallest width in px resize node can be
	minWidth: 50,
	
	// holdAspectRatio: bool
	// disable the resizehandles n, e, s, w
	holdAspectRatio: false,
	
	// showMask: bool
	// disable the opacity mask around the selected area
	showMask: true,
	
	showHandles: true,
	
	// showTooltip
	showTooltip: true,
	
	// dragCornerHoldsAspectRatio
	cornerRefreshOnAspect: true,
	
	templatePath: dojo.moduleUrl("simp","templates/RegionSelector.html"),
	
	Region: null,
	// --- dev model --- //
	_refreshHandle: {},
	_dblClickHandle: {},
	
	postCreate: function() {
		//dojo.connect(this.Region, "dblclick", "onDblClick");
		//dojo.connect(this.Region, "mousedown", "onMouseDown");
		//this._refreshHandle = dojo.connect(this.Region, "onResize", "_refresh");
		//this.Region = dijit.byId(this.domNode.id + "_simpRegion");
		//this.Region.coords.w = this.minWidth;
		//this.Region.coords.h = this.minHeight;
		//this.Region.coords.t = (this.domNode.clientHeight - this.minHeight) / 2
		//this.Region.coords.l = (this.domNode.clientWidth - this.minWidth) / 2
		console.debug("RegionSelector: create DragResizeRegion on: " + dojo.byId(this.domNode.id + "_simpRegion"))
		this.Region = new simp.DragResizeRegion({},dojo.byId(this.domNode.id + "_simpRegion"));
		this._refreshHandle = dojo.connect(this.Region, "onResize", this, "_refresh");
		this._dblClickHandle = dojo.connect(this.Region, "onRegionDblClick", this, "_onRegionDblClick");
		console.debug("DragResizeRegion created values: " + dojo.debugReturn(this.Region));
		this.setup();
	},
	
	setup: function() {
		
		this._setupRegion();
		if (this.Region != null) {
			this.Region.setBounds(dojo.coords(this.domNode));
			console.debug("this.Region.bounds: " + dojo.debugReturn(this.Region.getBounds()));
			this.RegionTooltip.defaultPosition = "below";
			//dojo.connect(this.Region, "onDblClick", this, "_onRegionDblClick")
	
			this._refreshMasks();
		}
	},
	
	_setupRegion: function() {
		this.Region.showHandles = this.showHandles;
		this.Region.minHeight = this.minHeight;
		this.Region.minWidth = this.minWidth;
		this.Region.holdAspectRatio = this.holdAspectRatio;
		this.Region.cornerRefreshOnAspect = this.cornerRefreshOnAspect;
		this.Region.setup();
	},
	
	_refresh: function() {
		this._refreshMasks();
		this.onSelection();
	},
	
	_refreshMasks: function() {
		if(!this.showMask) return;	
		
		var b = this.Region.getBounds();  
		var r = this.Region.getCoords();
		var offset = this.Region.getOffset();
		
		dojo.style(this.NOverlay, 'top', '0px');
		dojo.style(this.NOverlay, 'height', r.t - offset.y + 'px' );
		dojo.style(this.NOverlay, 'width', b.w + 'px');
		
		dojo.style(this.SOverlay, 'height', b.h  - (r.t + r.h + offset.y)  + 'px');
		dojo.style(this.SOverlay, 'top', r.t + r.h + 'px');
		dojo.style(this.SOverlay, 'width', b.w + 'px');
		
		dojo.style(this.EOverlay, 'height', r.h + offset.y  + 'px');
		dojo.style(this.EOverlay, 'width', b.w  - (r.l + r.w + offset.x) + 'px');
		dojo.style(this.EOverlay, 'top', r.t - offset.y + 'px');
		dojo.style(this.EOverlay, 'left', b.l + (r.l + r.w + offset.x) + 'px');

		dojo.style(this.WOverlay, 'height', r.h + offset.y + 'px');
		dojo.style(this.WOverlay, 'width', r.l - offset.x + 'px');
		dojo.style(this.WOverlay, 'top', r.t - offset.y + 'px');
		//dojo.style(this.WOverlay, 'left', '0px');
	},
	
	_stopRefresh: function(event) {
		dojo.stopEvent(event);
		dojo.disconnect(this._refreshHandle);
		console.debug("stop refresh");	
		this.onCompleted();
	},
	
	_onRegionDblClick: function() {
		console.debug("RegionSelector Region DblClick")
		this.onRegionDblClick();
	},
	
	getCoords: function() {
		return this.Region.coords;
	},
	
	setCoords: function(coords) {
		if (coords.t) 
			this.Region.coords.t = coords.t;
		if (coords.l)
			this.Region.coords.l = coords.l;
		if (coords.w)
			this.Region.coords.w = coords.w;
		if (coords.h)
			this.Region.coords.h = coords.h;
		this.setup();
	},	
	
	// events
	onSelection: function() {
		
	},
	
	onBegin: function() {
		
	},
	
	onCompleted: function () {
		
	},
	
	onRegionDblClick: function () {
		
	},

}
);
